import { getUserByIdUsingGet } from '@/services/student-management-system/yonghumokuai';
import { useModel } from '@@/exports';
import { Avatar, Card, Col, Descriptions, message, Row, Spin } from 'antd';
import React, { useEffect, useState } from 'react';

const ProfileInfo: React.FC = () => {
  const { initialState } = useModel('@@initialState');
  const { currentUser } = initialState || {};
  const [profileInfo, setProfileInfo] = useState<API.UserVO>({});
  const [loading, setLoading] = useState<boolean>(true);

  const getProfileInfo = async () => {
    setLoading(true);
    try {
      const res = await getUserByIdUsingGet({ id: currentUser?.id ?? 0 });
      if (res.code === 200) {
        message.success('获取数据成功');
        setProfileInfo(res.data ?? {});
      } else {
        message.error('获取数据失败：' + res.msg);
      }
    } catch (error) {
      message.error('请求出错，请稍后再试');
    } finally {
      setLoading(false);
    }
  };

  useEffect(() => {
    getProfileInfo();
  }, []);

  // 时间格式化函数
  const formatTime = (time?: string) => {
    return time ? new Date(time).toLocaleString() : '-';
  };

  return (
    <Card title="个人信息" bordered={false} style={{ maxWidth: 800, margin: 'auto' }}>
      <Spin spinning={loading}>
        <Row gutter={[16, 16]}>
          <Col span={18}>
            <Descriptions
              column={1}
              labelStyle={{ fontWeight: 'bold', width: 120 }}
              layout="vertical"
            >
              <Descriptions.Item label="用户ID">{profileInfo.id ?? '-'}</Descriptions.Item>
              <Descriptions.Item label="用户名">{profileInfo.username ?? '-'}</Descriptions.Item>
              <Descriptions.Item label="真实姓名">{profileInfo.realName ?? '-'}</Descriptions.Item>
              <Descriptions.Item label="手机号">{profileInfo.phone ?? '-'}</Descriptions.Item>
              <Descriptions.Item label="创建时间">
                {formatTime(profileInfo.createTime)}
              </Descriptions.Item>
              <Descriptions.Item label="更新时间">
                {formatTime(profileInfo.updateTime)}
              </Descriptions.Item>
            </Descriptions>
          </Col>
          <Col span={6}>
            <Avatar size={128} src={'https://img.znxs.vip/znxs/avatar_%E7%A5%9E%E9%87%8C.jpg'} />
          </Col>
        </Row>
      </Spin>
    </Card>
  );
};

export default ProfileInfo;
